light mode
night mode
জাভাস্ক্রিপ্ট (JavaScript)

ডোম ডকুমেন্ট (DOM Document)

Web Development - জাভাস্ক্রিপ্ট (JavaScript) - জাভাস্ক্রিপ্ট এইচটিএমএল ডোম (JS HTML DOM) | NCTB BOOK
OPTIONS
Test Yorself
All Question
Edit Content
Add Video
Add MCQ
Add Written
Error Report

একটি ওয়েব পেজের সকল অবজেক্টের মালিক হলো এইচটিএমএল ডোম ডকুমেন্ট অবজেক্ট।

এইচটিএমএল ডোম ডকুমেন্ট অবজেক্ট

ডকুমেন্ট অবজেক্ট একটি পেজকে প্রদর্শন করে।

একটি এইচটিএমএল পেজের যেকোন এলিমেন্টকে এক্সেস করতে অবশ্যই ডকুমেন্ট অবজেক্ট দিয়ে শুরু করতে হবে।

নিম্নলিখিত উদাহরণে এইচটিএমএল এলিমেন্টকে কিভাবে এক্সেস এবং পরিচালনা করা যায় তা দেখানো হলো:

এইচটিএমএল এলিমেন্ট খুজে বের করা

মেথডবর্ণনা
document.getElementById(id)এলিমেন্টের id দ্বারা এলিমেন্টকে খুঁজে বের করা হয়
document.getElementsByTagName(name)ট্যাগের নাম দিয়ে এলিমেন্টকে খুঁজে বের করা হয়
document.getElementsByClassName(name)এলিমেন্টের class দ্বারা এলিমেন্টকে খুঁজে বের করা হয়

এইচটিএমএল এলিমেন্ট পরিবর্তন

মেথডবর্ণনা
element.innerHTML =  নতুন এইচটিএমএল কন্টেন্টএকটি এলিমেন্টের ভিতরের কন্টেন্টকে পরিবর্তন করে
element.attribute = নতুন ভ্যালুএইচটিএমএল এলিমেন্টের এট্রিবিউট ভ্যালু পরিবর্তন করে
element.setAttribute(এট্রিবিউট, ভেলু(value))এইচটিএমএল এলিমেন্টের এট্রিবিউট ভ্যালু পরিবর্তন করে
element.style.property = নতুন স্টাইলএইচটিএমএল এলিমেন্টের স্টাইল পরিবর্তন করে

এলিমেন্ট যোগ এবং বাদ দেওয়া

মেথডবর্ণনা
document.createElement(এলিমেন্ট)নতুন এলিমেন্ট তৈরি করে
document.removeChild(এলিমেন্ট)এইচটিএমএল এলিমেন্টকে মুছে দেয়
document.appendChild(এলিমেন্ট)এইচটিএমএল এলিমেন্ট যোগ করে
document.replaceChild(এলিমেন্ট)এইচটিএমএল এলিমেন্টকে প্রতিস্থাপন করে
document.write(টেক্সট)এইচটিএমএল ডকুমেন্টে লিখার জন্য ব্যবহার করে

ইভেন্ট হ্যান্ডলার সংযুক্ত করার পদ্ধতি

মেথডবর্ণনা
document.getElementById(id).onclick = function(){কোড}একটি অনক্লিক ইভেন্টে ইভেন্ট হ্যান্ডলার কোড যোগ করে

এইচটিএমএল অবজেক্টকে এক্সেস

প্রথম এইচটিএমএল ডোম আবিষ্কৃত হয় ১৯৯৮ সালে, যেখানে ১১টি এইচটিএমএল অবজেক্ট, অবজেক্ট কালেকশন এবং প্রোপার্টি ছিল। এগুলো এইচটিএমএল ৫ এ এখনো ভ্যালিড।

পরবর্তীতে এইচটিএমএল ডোম লেভেল ৩ এ আরও অবজেক্ট, অবজেক্ট কালেকশন, এবং প্রোপার্টি সংযুক্ত করা হয়েছে।

প্রোপার্টিবর্ণনাডোম
document.anchorsযেসকল <a> এলিমেন্টের name এট্রিবিউট রয়েছে সেগুলোকে রিটার্ন করে১
document.appletsসকল <applet> এলিমেন্টকে রিটার্ন করে (এইচটিএমএল 5 এ অনুমোদন বাদ দেয়া হয়েছে)১
document.baseURIডকুমেন্টের base URI রিটার্ন করে৩
document.body<body> এলিমেন্টকে রিটার্ন করে১
document.cookieডকুমেন্টের কুকি রিটার্ন করে১
document.doctypeডকুমেন্টের doctype এর নাম রিটার্ন করে৩
document.documentElement<html> এলিমেন্টকে রিটার্ন করে৩
document.documentModeব্রাউজারের ব্যবহৃত মুডকে রিটার্ন করে৩
document.documentURIডকুমেন্টের URI রিটার্ন করে৩
document.domainডকুমেন্ট সার্ভারের ডোমেইনের নাম রিটার্ন করে১
document.domConfigঅপ্রচলিত ডোম কনফিগারেশান রিটার্ন করে৩
document.embedsসকল <embed> এলিমেন্ট রিটার্ন করে৩
document.formsসকল <form> এলিমেন্ট রিটার্ন করে১
document.head<head> এলিমেন্ট রিটার্ন করে৩
document.imagesসকল <img> এলিমেন্ট রিটার্ন করে১
document.implementationডোম ইমপ্লিমেনটেশন রিটার্ন করে৩
document.inputEncodingডকুমেন্ট এনকোডিং রিটার্ন করে৩
document.lastModifiedডকুমেন্ট আপডেট হওয়ার তারিখ এবং সময় রিটার্ন করে৩
document.linksযেসকল <area> এবং <a> এলিমেন্টে href এট্রিবিউট রয়েছে সেগুলোকে রিটার্ন করে১
document.readyStateডকুমেন্টের স্ট্যাটাস রিটার্ন করে৩
document.referrerলিঙ্কিং ডকুমেন্টের নির্দেশকের URI রিটার্ন করে1
document.scriptsসকল <script> এলিমেন্টকে রিটার্ন করে3
document.strictErrorCheckingএঁরর চেকিং সচল আছে কিনা রিটার্ন করে3
document.title<title> এলিমেন্টকে রিটার্ন করে1
document.URLডকুমেন্টের সম্পূর্ন URL রিটার্ন করে1

 


 

Content added By
Ibnul Haisan

আরও দেখুন...

ডোম ডকুমেন্ট (DOM Document)

or

Don't have an account? Register

Promotion